<template>
  <view v-if="isLoad" class="login">
    <img style="width: 506rpx; height: 220rpx" src="/static/login/logo.png" />
    <!-- <button type="primary" text="确定">确定</button> -->
    <!-- <view class="auth-title" @click="handleLogin">手机号登陆</view> -->
    <button class="button_login" type="primary" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">
      手机号登陆
    </button>

    <view style="margin-top: 50rpx; display: flex; align-items: center">
      <u-checkbox-group @change="checkboxChange">
        <u-checkbox v-model="checked" />
      </u-checkbox-group>

      <text>我已阅读并同意<text style="color: #00be8c">《服务协议》</text>
        和
        <text style="color: #00be8c">《隐私政策》</text>
      </text>
    </view>
  </view>
</template>

<script>
import * as LoginApi from "@/api/login";
export default {
  components: {},

  data() {
    return {
      // 数据加载完成 [防止在微信小程序端onLoad和view渲染同步进行]
      isLoad: false,
      checked: false,
      code: "",
    };
  },

  /**
   * 生命周期函数--监听页面加载
   */
  async onLoad(options) {
    // 数据加载完成
    this.isLoad = true;

    const platform = uni.getSystemInfoSync().uniPlatform;

    const app = this;
    if (platform == "mp-weixin") {
      wx.login({ 
        success: function (loginRes) {
          console.log('loginRes',loginRes);
          
          app.code = loginRes.code;
        }
      });
    } else {
      my.getAuthCode({
        scopes: 'auth_user',
        success: (auth) => {
          console.log('支付宝授权凭证', auth);
          app.code = auth?.authCode


          // try {
          //   const data = LoginApi.loginMpAlipayMobile({
          //     code: auth?.authCode,
          //   });

          //   console.log('data', data);
          // } catch (error) {
          //   console.log('error', error);


          // }

        },
      });
    }




 
  },

  methods: {
    handleLogin() { },
    async getPhoneNumber(e) {

      // 判断是否支付宝环境
      const platform = uni.getSystemInfoSync().uniPlatform;





      if (e.detail.errMsg === "getPhoneNumber:ok") {
        // 用户点击了允许
        console.log('e.asdfffffffffffffff', e.detail);

        if (platform != "mp-weixin") {

          my.getPhoneNumber({
            success: async (res) => {
              let encryptedData = res.response;
              // my.request({
              //   //你的服务器地址
              //   url: 'https://xxxxxxx',
              //   data: encryptedData,
              // });
              const data = await LoginApi.loginMpAlipayMobile({
                encryptedData,
                code: this.code,
                iv,
              });

              // 把token存到缓存中
              uni.setStorageSync("token", data.token);

              // 跳到首页
              uni.switchTab({
                url: "/pages/newindex/index",
                success() {
                  uni.showToast({
                    title: "登录成功",
                  });
                },
                fail(error) {
                  console.log("errorerrorerror", error);
                },
              });

            },
            fail: (res) => {
              console.log(res);
            },
          });

          return
        }

        // // 跳到首页
        // uni.switchTab({
        //   url: "/pages/newindex/index",
        // });

        // uni.setStorageSync("token", `data.token`);

        // return;

        const { encryptedData, iv } = e.detail;




        // 判断是否微信小程序环境


        // 判断是否微信小程序环境
        // if (platform != "mp-weixin") {
        //   console.log('支付宝环境');

        //   const data = await LoginApi.loginMpAlipayMobile({
        //     encryptedData,
        //     code: this.code,
        //     iv,
        //   });



        //   // 把token存到缓存中
        //   uni.setStorageSync("token", data.token);

        //   // 跳到首页
        //   uni.switchTab({
        //     url: "/pages/newindex/index",
        //     success() {
        //       uni.showToast({
        //         title: "登录成功",
        //       });
        //     },
        //     fail(error) {
        //       console.log("errorerrorerror", error);
        //     },
        //   });
        //   // 非微信小程序环境
        //   return;
        // }

        try {
          const data = await LoginApi.loginMpWxMobile({
            encryptedData,
            code: this.code,
            iv,
          });



          // 把token存到缓存中
          uni.setStorageSync("token", data.token);

          // 跳到首页
          uni.switchTab({
            url: "/pages/newindex/index",
            success() {
              uni.showToast({
                title: "登录成功",
              });
            },
            fail(error) {
              console.log("errorerrorerror", error);
            },
          });
        } catch (error) {
          console.log('error', error);

        }
      } else {
        // 用户拒绝授权
        uni.showToast({
          title: "获取手机号失败",
          icon: "none",
        });
      }
    },

    checkboxChange() {
      // this.checked = !this.checked;/
    },
  },
};
</script>

<style lang="scss" scoped>
.login {
  display: flex;
  flex-direction: column;
  align-items: center;
  height: 100vh;
  padding-top: 40%;
  // 上下左右居中
}

.auth-title {
  margin-top: 55rpx;
  width: 80%;
  height: 70rpx;
  line-height: 26rpx;
  border-radius: 25rpx;
  background-color: rgba(0, 190, 140, 1);
  color: rgba(255, 255, 255, 1);
  font-size: 22rpx;
  text-align: center;
  font-family: -regular;
  border: 0rpx solid rgba(121, 121, 121, 1);

  display: flex;
  justify-content: center;
  align-items: center;
}

.button_login {
  width: 80%;
  border-radius: 25rpx;
  margin-top: 50px;
}
</style>
